<template>
	<view>
		<view v-for="(item,index) in commentslist" :key="index">
			<uni-card :title="item.id+''" thumbnail="" :extra="item.postDate" :note="item.foodId">
				{{item.comment}}
			</uni-card>
		</view>
	</view>
</template>

<script>
	export default {
		onReachBottom() {
			//上拉加载
			this.getMore()
		},
		onPullDownRefresh() {
			this.getComments(0)
		},
		methods:{
			getMore(){
				uni.showLoading({
					title:"加载中",
					mask:false
				});
				this.pageIndex ++
				uni.request({
					url: 'http://localhost:8090/foodapp/comments/getCommentsByFoodIdByPage',
					method: 'POST',
					data: {
						  "foodid": 1, 
						  "pageIndex": this.pageIndex,
						  "pageSize": this.pageSize
					},
					success: res => {
						this.commentslist=[...this.commentslist,...res.data.data.content]
						setTimeout(()=>{
							uni.hideLoading()
						},2000)
						
					},
					fail: () => {},
					complete: () => {}
				});
			},
			getComments(index){ 
				uni.request({
					url: 'http://localhost:8090/foodapp/comments/getCommentsByFoodIdByPage',
					method: 'POST',
					data: {
						  "foodid": 1, 
						  "pageIndex": index,
						  "pageSize": this.pageSize
					},
					success: res => {
						setTimeout(()=>{
							uni.stopPullDownRefresh()
						},2000)
						
						console.log(res);
						this.commentslist = res.data.data.content 
					},
					fail: () => {},
					complete: () => {}
				});
			}
		},
		onLoad() {
			this.getComments(0);
			
		},
		data() {
			return {
				commentslist: [{
					"id": 31,
					"comment": "sadf",
					"foodId": 1,
					"postDate": "2024-03-15",
					"userId": 22
				},{
					"id": 31,
					"comment": "sadf",
					"foodId": 1,
					"postDate": "2024-03-15",
					"userId": 22
				}], 
				pageIndex: 0, 
				pageSize: 10, 
				foodid: 1 
			}
		}
	}
</script>

<style>
	page{
		background-color: #eee;
	}
</style>
